<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>新手指引</title>
    <link rel="stylesheet" href="../../public/css/CSS/reset.min.css">
    <link rel="stylesheet" href="../../public/css/other/productInfo.css">
    <link rel="stylesheet" href="../../public/css/other/clearOutline.css">
</head>

<body>
<div class="pc">
    <!--外部容器-->
    <div class="top-bar-wrapper">
        <!-- 中间主体部分容器 -->
        <div class="top-bar">
            <!-- 网站的logo -->
            <h1 class="logo">
                <a href="/">
                    <img src="../../public/resources/logo.png">
                    <span>成为更好的自己</span>
                </a>
            </h1>

            <!-- 菜单栏 -->
            <div class="left-menu">
                <!-- 创建菜单图标 -->
                <ul class="menu-icon">
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
                <!-- 创建菜单 -->
                <ul class="nav">
                    <!-- 超链接的地址，写各个页面的地址 -->
                    <li><a href="./../myPlan/myTodo.html">个人计划</a></li>
                    <li><a href="./../note-program/index.html">我的笔记</a></li>
                    <li><a href="./../minder/mind.html">思维导图</a></li>
                    <li><a href="./../dataStatistics/dataStatistics.html">数据统计</a></li>
                    <li><a href="./../square/square.html">广场</a></li>
                </ul>

            </div>

            <!-- 用户信息 -->
            <div class="user-info">
                <!-- 这里是可以跳转到用户信息详细设置页的，写用户信息详细设置页的地址 -->
                <a href="./../other/noviceGuidance.html">
                    <img src="../../public/resources/user-pic.jpg" alt="用户头像">
                </a>
            </div>
        </div>
    </div>
    <div class="main-wrapper">
        <!--侧边栏-->
        <aside>
            <div class="aside-title">
                <p>个人中心</p>
            </div>
            <a href="modifyName.html">修改昵称</a>
            <a href="modifyPsw.html">修改密码</a>
            <a href="noviceGuidance.html">新手指引</a>
            <a href="productIntro.html"  style="color: #4fbef6;">产品简介</a>
            <div class="edition">
                <p>版本号V1.0.1</p>
            </div>
        </aside>
        <!--主体区域-->
        <main class="pc-main">
            <p>你是否也曾立下目标，要坚持早起，坚持背单词三个月，坚持每天看一本书，坚持每天锻炼一小时……也曾坚信对于自己设立的小小目标，轻轻松松就可以完成，似乎在刚立下目标的那几天，一切确实都像计划中那样进行，但是随着时间的流逝，慢慢地当初立下的目标就在时间的长河里粉碎成了尘埃，消散不见。</p><br>
            <p>Better Me的初衷就是帮助立下目标的人更高效的完成自己设置的目标，从而成为一个更自律的人~</p><br>
            <p>产品内包含个人计划、我的笔记、思维导图、数据统计、广场五大模块。</p><br>
            <p>在个人计划中，您可以创建今日计划和长期计划，页面左下角也会动态显示临近计划完成情况</p><br>
            <p>在我的笔记中，您可以归档您的笔记，通过Markdown编辑器实现笔记的整理</p><br>
            <p>在思维导图中，您可以随时记录头脑风暴，随时整理逻辑</p><br>
            <p>在数据统计中，您可以随时了解自己的产品使用情况</p><br>
            <p>在广场中，您可以随时了解其他伙伴的目标完成情况，相互监督，共同成长</p><br>
            <p>乘风破浪会有时，直挂云帆济沧海</p><br>
            <div><p>我们期待，您成为更好的自己！</p><img src="./../../public/resources/logo.png"></div>
        </main>
    </div>
</div>
<div class="mobile">
    <header id="registerHeader">
        <img id="returnBtn" src="./../../public/resources/arrow-back.png">
        <p id="registerTitle">产品简介</p>
    </header>
    <main class="mobile-main">
        <div class="mobile-div">
            <p>&nbsp;&nbsp;&nbsp;&nbsp;你是否也曾立下目标，要坚持早起，坚持背单词三个月，坚持每天看一本书，坚持每天锻炼一小时……也曾坚信对于自己设立的小小目标，轻轻松松就可以完成，似乎在刚立下目标的那几天，一切确实都像计划中那样进行，但是随着时间的流逝，慢慢地当初立下的目标就在时间的长河里粉碎成了尘埃，消散不见。</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;Better Me的初衷就是帮助立下目标的人更高效的完成自己设置的目标，从而成为一个更自律的人</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;产品内包含个人计划、我的笔记、思维导图、数据统计、广场五大模块。</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;在个人计划中，您可以创建今日计划和长期计划，页面左下角也会动态显示临近计划完成情况</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;在我的笔记中，您可以归档您的笔记，通过Markdown编辑器实现笔记的整理</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;在思维导图中，您可以随时记录头脑风暴，随时整理逻辑</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;在数据统计中，您可以随时了解自己的产品使用情况</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;在广场中，您可以随时了解其他伙伴的目标完成情况，相互监督，共同成长</p><br>
            <p>&nbsp;&nbsp;&nbsp;&nbsp;乘风破浪会有时，直挂云帆济沧海</p><br>
            <div><p>我们期待，您成为更好的自己！</p><img src="./../../public/resources/logo.png"></div>
        </div>
    </main>
</div>
<script src="../../public/js/userInfo.js"></script>
<script src="../../public/js/api.js"></script>
<script src="../../public/js/other/productInfo.js"></script>
</body>
</html>